<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
    <script src="{{ url_for('static', filename='script.js') }}"></script>

    <title>Risk Assessment Tool</title>
    <style>
        /* Add some basic styling */
        #logout-btn {
            position: absolute;
            top: 10px;
            right: 10px;
        }
    </style>
</head>
<body>
    <div id="logout-btn">
        <a href="{{ url_for('logout') }}">Logout</a>
    </div>

    <h1>Risk Assessment Tool</h1>
    
    <form action="/" method="post">
        <label for="description">Risk Description:</label>
        <input type="text" name="description" required><br>
        
        <label for="impact">Impact (1-10):</label>
        <input type="number" name="impact" min="1" max="10" required><br>
        
        <label for="likelihood">Likelihood (1-10):</label>
        <input type="number" name="likelihood" min="1" max="10" required><br>

        <!-- Category dropdown -->
        <label for="category">Category:</label>
        {% if categories %}
        <select name="category">
            {% for category in categories %}
            <option value="{{ category[0] }}">{{ category[1] }}</option>
            {% endfor %}
        </select>
        {% else %}
        <p>No categories available. Please add some categories first.</p>
        {% endif %}

        <!-- Status dropdown -->
        <label for="status">Status:</label>
        {% if statuses %}
        <select name="status">
            {% for status in statuses %}
            <option value="{{ status[0] }}">{{ status[1] }}</option>
            {% endfor %}
        </select><br>
        {% else %}
        <p>No statuses available. Please add some statuses first.</p>
        {% endif %}
        
        <input type="submit" value="Add Risk">
        
    </form>
    <a href="{{ url_for('dashboard') }}">
        <button>Go to Dashboard</button>
    </a>

    <div>
    <a href="{{ url_for('subscribe') }}" >
        <button>Subscribe</button>
    </a>
    </div>
    <h2>List of Risks:</h2>
    <table border="1">
        <tr>
            <th>Description</th>
            <th>Impact</th>
            <th>Likelihood</th>
            <th>Risk Score</th>
            <th>Status</th>
            <th>Category</th> <!-- New column for status -->
            <th>Comments</th>
        </tr>
        {% for risk_data in risks %}
        <tr data-href="{{ url_for('edit_risk', risk_id=risk_data['risk'][0]) }}"></tr>
            <td>{{ risk_data['risk'][1] }}</td>
            <td>{{ risk_data['risk'][2] }}</td>
            <td>{{ risk_data['risk'][3] }}</td>
            <td>{{ risk_data['risk'][4] }}</td>
            <td>{{ risk_data['risk'][6] }}</td>
            <td>{{ risk_data['risk'][7] }}</td> <!-- Displaying the status here -->
            <td>
                <!-- List existing comments for the risk -->
                {% for comment in risk_data['comments'] %}
                <p>{{ comment[2] }}</p>
                {% endfor %}
                <!-- Add new comment form -->
                <form action="/add_comment/{{ risk_data['risk'][0] }}" method="post">
                    <input type="text" name="comment_text" placeholder="Add a comment..." required>
                    <input type="submit" value="Comment">
                </form>
                <a href="{{ url_for('edit_risk', risk_id=risk_data['risk'][0]) }}">Edit</a>
                <form action="{{ url_for('delete_risk', risk_id=risk_data['risk'][0]) }}" method="post" onsubmit="return confirm('Are you sure you want to delete this risk?');">
                   
                    <button class="delete-button" onclick="return confirmDelete();" type="submit">Delete</button>

                </form>

            </td>
            
        </tr>
        {% endfor %}
    </table>
    <script src="{{ url_for('static', filename='script.js') }}"></script>

</body>
</html>
